Comment puis-je supprimer un élément spécifique d'un tableau?

1
2
3
4
Prochain
Recherchez l'index de l'élément de tableau que vous souhaitez supprimer à l'aide de indexOf, puis supprimez cet index avec splice.
La méthode splice () modifie le contenu d'un tableau en supprimant
éléments existants et / ou ajout de nouveaux éléments.
tableau const = [2, 5, 9];
console.log (tableau);
index const = tableau.indexOf (5);
if (index> -1) {
array.splice (index, 1);
}
// tableau = [2, 9]
console.log (tableau);
Le deuxième paramètre d'épissure est le nombre d'éléments à supprimer. Notez que splice modifie le tableau en place et renvoie un nouveau tableau contenant les éléments qui ont été supprimés.
Par souci d'exhaustivité, voici les fonctions. La première fonction ne supprime qu'une seule occurrence (c'est-à-dire en supprimant la première correspondance de 5 de [2,5,9,1,5,8,5]), tandis que la deuxième fonction supprime toutes les occurrences:
function removeItemOnce (arr, valeur) {
var index = arr.indexOf (valeur);
if (index> -1) {
arr.splice (index, 1);
}
return arr;
}
function removeItemAll (arr, valeur) {
var i = 0;
while (i  = 0; i--) {
if (tableau [i] === nombre) {
array.splice (i, 1);
}
}
Si vous voulez simplement que l'élément à l'index i n'existe plus, mais que vous ne voulez pas que les index des autres éléments changent:
supprimer le tableau [i];
|
Édité en octobre 2016
Faites-le simple, intuitif et explicite (rasoir d'Occam)
Faites-le immuable (la matrice d'origine reste inchangée)
Faites-le avec les fonctions JavaScript standard, si votre navigateur ne les prend pas en charge - utilisez polyfill
Dans cet exemple de code, j'utilise la fonction "array.filter (...)" pour supprimer les éléments indésirables d'un tableau. Cette fonction ne modifie pas le tableau d'origine et en crée un nouveau. Si votre navigateur ne prend pas en charge cette fonction (par exemple, Internet Explorer avant la version 9 ou Firefox avant la version 1.5), pensez à utiliser le filtre polyfill de Mozilla.
Suppression de l'élément (ECMA-262 Edition 5 code aka oldstyle JavaScript)
valeur var = 3
var arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter (fonction (élément) {
article de retour! == valeur
})
console.log (arr)
// [1, 2, 4, 5]
Suppression de l'élément (code ECMAScript 6)
soit valeur = 3
soit arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter (item => item! == valeur)
console.log (arr)
// [1, 2, 4, 5]
IMPORTANT La syntaxe de la fonction de flèche ECMAScript 6 "() => {}" n'est pas du tout prise en charge dans Internet Explorer, Chrome avant la version 45, Firefox avant la version 22 et Safari avant la version 10. Pour utiliser la syntaxe ECMAScript 6 dans les anciens navigateurs, vous pouvez utiliser BabelJS.
Suppression de plusieurs éléments (code ECMAScript 7)
Un avantage supplémentaire de cette méthode est que vous pouvez supprimer plusieurs éléments
laissez forDeletion = [2, 3, 5]
soit arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter (item =>! forDeletion.includes (item))
// !!! Lisez ci-dessous à propos de array.includes (...) support !!!
console.log (arr)
// [1, 4]
IMPORTANT La fonction "array.includes (...)" n'est pas du tout prise en charge dans Internet Explorer, Chrome avant la version 47, Firefox avant la version 43, Safari avant la version 9 et Edge avant la version 14 donc voici polyfill de Mozilla.
Suppression de plusieurs éléments (à l'avenir, peut-être)
Si la proposition "This-Binding Syntax" est acceptée, vous pourrez faire ceci:
// tableau-lib.js
fonction d'exportation remove (... forDeletion) {
renvoyer this.filter (item =>! forDeletion.includes (item))
}
// main.js
importer {supprimer} de './array-lib.js'
soit arr = [1, 2, 3, 4, 5, 3]
// :: Proposition de syntaxe This-Binding
// utilisation de la fonction "remove" comme "méthode virtuelle"
// sans étendre Array.prototype
arr = arr :: supprimer (2, 3, 5)
console.log (arr)
// [1, 4]
Essayez-le vous-même dans BabelJS :)
Référence
Array.prototype.inclut
Composition fonctionnelle
|
Cela dépend si vous voulez garder une place vide ou non.
Si vous voulez un emplacement vide:
tableau [index] = indéfini;
Si vous ne voulez pas d'espace vide:
// Pour conserver l'original:
// oldArray = [... tableau];
// Ceci modifie le tableau.
array.splice (index, 1);
Et si vous avez besoin de la valeur de cet élément, vous pouvez simplement stocker l'élément du tableau retourné:
var valeur = array.splice (index, 1) [0];
Si vous souhaitez supprimer à l'une des extrémités du tableau, vous pouvez utiliser array.pop () pour le dernier ou array.shift () pour le premier (les deux renvoient également la valeur de l'élément).
Si vous ne connaissez pas l'index de l'élément, vous pouvez utiliser array.indexOf (élément) pour l'obtenir (dans un if () pour obtenir un élément ou dans un moment () pour tous les obtenir). array.indexOf (item) renvoie l'index ou -1 s'il n'est pas trouvé.
|
Un ami avait des problèmes avec Internet Explorer 8 et m'a montré ce qu'il faisait. Je lui ai dit que c'était faux, et il m'a dit qu'il avait la réponseici. La réponse principale actuelle ne fonctionnera pas dans tous les navigateurs (Internet Explorer 8 par exemple) et supprimera uniquement la première occurrence de l'élément.
Supprimer TOUTES les instances d'un tableau
function array_remove_index_by_value (arr, élément)
{
pour (var i = arr.length; i--;)
{
if (arr [i] === élément) {arr.splice (i, 1);}
}
}
Il parcourt le tableau en arrière (puisque les indices et la longueur changeront à mesure que les éléments sont supprimés) et supprime l'élément s'il est trouvé. Cela fonctionne dans tous les navigateurs.
|
Il existe deux approches principales:
splice (): anArray.splice (index, 1);
supprimer: supprimer anArray [index];
Soyez prudent lorsque vous utilisez la suppression pour un tableau. C'est bon pour supprimer les attributs des objets, mais pas si bon pour les tableaux. Il est préférable d'utiliser l'épissure pour les tableaux.
Gardez à l'esprit que lorsque vous utilisez delete pour un tableau, vous pouvez obtenir des résultats erronés pour anArray.length. En d'autres termes, supprimer supprimerait l'élément, mais ne mettrait pas à jour la valeur de la propriété length.
Vous pouvez également vous attendre à des trous dans les numéros d'index après l'utilisation de la suppression, par exemple. vous pourriez vous retrouver avec les index 1, 3, 4, 8, 9 et 11 et la longueur comme avant d'utiliser la suppression. Dans ce cas, toutes les boucles indexées for planteraient, car les index ne sont plus séquentiels.
Si vous êtes obligé d'utiliser la suppression pour une raison quelconque, vous devez utiliser pour chaque boucle lorsque vous avez besoin de parcourir des tableaux. En fait, évitez toujours d'utiliser des boucles for indexées, si possible. De cette façon, le code serait plus robuste et moins sujet aux problèmes d'index.
|
Array.prototype.remove_by_value = function (val) {
pour (var i = 0; i  row.id === 5);
var enlevé = helper.remove (arr, row => row.name.startsWith ('BMW'));
##Définition
var helper = {
// Supprime et renvoie la première occurrence
removeOne: function (tableau, prédicat) {
pour (var i = 0; i  [2, 3, 4]
|
Vous pouvez utiliser ES6. Par exemple pour supprimer la valeur '3' dans ce cas:
var array = ['1', '2', '3', '4', '5', '6']
var newArray = array.filter ((valeur) => valeur! = '3');
console.log (newArray);
Production :
["1", "2", "4", "5", "6"]
|
Si vous voulez un nouveau tableau avec les positions supprimées supprimées, vous pouvez toujours supprimer l'élément spécifique et filtrer le tableau. Il peut avoir besoin d'une extension de l'objet tableau pour les navigateurs qui n'implémentent pas la méthode de filtrage, mais à long terme, c'est plus facile puisque tout ce que vous faites est le suivant:
var my_array = [1, 2, 3, 4, 5, 6];
supprimer mon_array [4];
console.log (my_array.filter (function (a) {return typeof a! == 'undefined';}));
Il devrait afficher [1, 2, 3, 4, 6].
|
Voici quelques façons de supprimer un élément d'un tableau à l'aide de JavaScript.
Toutes les méthodes décrites ne modifient pas le tableau d'origine, mais en créent un nouveau.
Si vous connaissez l'index d'un article
Supposons que vous ayez un tableau et que vous souhaitiez supprimer un élément en position i.
Une méthode consiste à utiliser slice ():
éléments const = ['a', 'b', 'c', 'd', 'e', ​​'f']
const i = 3
const filteredItems = items.slice (0, i) .concat (items.slice (i + 1, items.length))
console.log (filteredItems)
slice () crée un nouveau tableau avec les index qu'il reçoit. Nous créons simplement un nouveau tableau, du début à l'index que nous voulons supprimer, et concaténons un autre tableau de la première position suivant celle que nous avons supprimée à la fin du tableau.
Si vous connaissez la valeur
Dans ce cas, une bonne option est d'utiliser filter (), qui offre une approche plus déclarative:
éléments const = ['a', 'b', 'c', 'd', 'e', ​​'f']
const valueToRemove = 'c'
const filteredItems = items.filter (item => item! == valueToRemove)
console.log (filteredItems)
Cela utilise les fonctions fléchées ES6. Vous pouvez utiliser les fonctions traditionnelles pour prendre en charge les anciens navigateurs:
éléments const = ['a', 'b', 'c', 'd', 'e', ​​'f']
const valueToRemove = 'c'
const filteredItems = items.filter (fonction (élément) {
article de retour! == valueToRemove
})
console.log (filteredItems)
ou vous pouvez utiliser Babel et transpiler le code ES6 vers ES5 pour le rendre plus digeste pour les anciens navigateurs, tout en écrivant du JavaScript moderne dans votre code.
Suppression de plusieurs éléments
Et si, au lieu d'un seul élément, vous souhaitiez supprimer plusieurs éléments?
Trouvons la solution la plus simple.
Par index
Vous pouvez simplement créer une fonction et supprimer des éléments en série:
éléments const = ['a', 'b', 'c', 'd', 'e', ​​'f']
const removeItem = (éléments, i) =>
items.slice (0, i-1) .concat (items.slice (i, items.length))
laissez filteredItems = removeItem (éléments, 3)
filteredItems = removeItem (filteredItems, 5)
//["a B c d"]
console.log (filteredItems)
Par valeur
Vous pouvez rechercher une inclusion dans la fonction de rappel:
éléments const = ['a', 'b', 'c', 'd', 'e', ​​'f']
const valuesToRemove = ['c', 'd']
const filteredItems = items.filter (item =>! valuesToRemove.includes (item))
// ["a", "b", "e", "f"]
console.log (filteredItems)
Évitez de muter la baie d'origine
splice () (à ne pas confondre avec slice ()) mute le tableau d'origine et doit être évité.
(initialement publié sur mon site https://flaviocopes.com/how-to-remove-item-from-array/)
|
Consultez ce code. Cela fonctionne dans tous les principaux navigateurs.
remove_item = function (arr, valeur) {
var b = '';
for (b in arr) {
if (arr [b] === valeur) {
arr.splice (b, 1);
Pause;
}
}
return arr;
};
Appelez cette fonction
remove_item (tableau, valeur);
|
ES6 & sans mutation: (octobre 2016)
const removeByIndex = (liste, index) =>
[
... list.slice (0, index),
... list.slice (index + 1)
];
output = removeByIndex ([33,22,11,44], 1) // => [33,11,44]
console.log (sortie)
|
Vous pouvez utiliser lodash _.pull (mutate array), _.pullAt (mutate array) ou _.without (ne mute pas le tableau)
var array1 = ['a', 'b', 'c', 'd']
_.pull (tableau1, 'c')
console.log (tableau1) // ['a', 'b', 'd']
var array2 = ['e', 'f', 'g', 'h']
_.pullAt (tableau2, 0)
console.log (tableau2) // ['f', 'g', 'h']
var array3 = ['i', 'j', 'k', 'l']
var newArray = _.without (tableau3, 'i') // ['j', 'k', 'l']
console.log (tableau3) // ['i', 'j', 'k', 'l']
|
La suppression d'un élément / d'une chaîne en particulier d'un tableau peut être effectuée en une seule ligne:
theArray.splice (theArray.indexOf ("stringToRemoveFromArray"), 1);
où:
theArray: le tableau dont vous voulez supprimer quelque chose de particulier
stringToRemoveFromArray: la chaîne que vous souhaitez supprimer et 1 est le nombre d'éléments que vous souhaitez supprimer.
REMARQUE: Si "stringToRemoveFromArray" n'est pas localisé dans votre tableau, cela supprimera le dernier élément du tableau.
Il est toujours bon de vérifier d'abord si l'élément existe dans votre tableau, avant de le supprimer.
if (theArray.indexOf ("stringToRemoveFromArray")> = 0) {
theArray.splice (theArray.indexOf ("stringToRemoveFromArray"), 1);
}
Si vous avez accès à des versions plus récentes d'Ecmascript sur les ordinateurs de votre client (ATTENTION, peut ne pas fonctionner sur les anciennes stations):
var array = ['1', '2', '3', '4', '5', '6']
var newArray = array.filter ((valeur) => valeur! = '3');
Où «3» est la valeur que vous souhaitez supprimer du tableau.
Le tableau deviendrait alors: ['1', '2', '4', '5', '6']
|
OK, par exemple, vous avez le tableau ci-dessous:
var num = [1, 2, 3, 4, 5];
Et nous voulons supprimer le numéro 4. Vous pouvez simplement utiliser le code ci-dessous:
num.splice (num.indexOf (4), 1); // num sera [1, 2, 3, 5];
Si vous réutilisez cette fonction, vous écrivez une fonction réutilisable qui sera attachée à la fonction de tableau native comme ci-dessous:
Array.prototype.remove = Array.prototype.remove || fonction (x) {
const i = this.indexOf (x);
si (i === - 1)
revenir;
this.splice (i, 1); // num.remove (5) === [1, 2, 3];
}
Mais qu'en est-il si vous avez le tableau ci-dessous à la place avec quelques [5] s dans le tableau?
var num = [5, 6, 5, 4, 5, 1, 5];
Nous avons besoin d'une boucle pour tous les vérifier, mais un moyen plus simple et plus efficace consiste à utiliser des fonctions JavaScript intégrées, nous écrivons donc une fonction qui utilise un filtre comme ci-dessous:
const _removeValue = (arr, x) => arr.filtre (n => n! == x);
// _ removeValue ([1, 2, 3, 4, 5, 5, 6, 5], 5) // Retourne [1, 2, 3, 4, 6]
Il existe également des bibliothèques tierces qui vous aident à le faire, comme Lodash ou Underscore. Pour plus d'informations, consultez lodash _.pull, _.pullAt ou _.without.
|
Performance
Aujourd'hui (09/12/2019) je réalise des tests de performances sur macOS v10.13.6 (High Sierra) pour les solutions choisies. Je montre delete (A), mais je ne l'utilise pas en comparaison avec d'autres méthodes, car il a laissé un espace vide dans le tableau.
Les conclusions
la solution la plus rapide est array.splice (C) (sauf Safari pour les petits tableaux où il a la deuxième fois)
pour les grands tableaux, array.slice + splice (H) est la solution immuable la plus rapide pour Firefox et Safari; Array.from (B) est le plus rapide dans Chrome
les solutions mutables sont généralement 1,5x-6x plus rapides que les solutions immuables
pour les petites tables sur Safari, étonnamment la solution mutable (C) est plus lente que la solution immuable (G)
Détails
Dans les tests, je supprime l'élément central du tableau de différentes manières. Les solutions A, C sont en place. Les solutions B, D, E, F, G, H sont immuables.
Résultats pour tableau avec 10 éléments
Dans Chrome, array.splice (C) est la solution sur place la plus rapide. Le array.filter (D) est la solution immuable la plus rapide. Le plus lent est array.slice (F). Vous pouvez effectuer le test sur votre machine ici.
Résultats pour un tableau avec 1.000.000 éléments
Dans Chrome, array.splice (C) est la solution sur place la plus rapide (la suppression (C) est similaire rapide - mais elle a laissé un emplacement vide dans le tableau (il n'effectue donc pas de «suppression complète»)). Le array.slice-splice (H) est la solution immuable la plus rapide. Le plus lent est array.filter (D et E). Vous pouvez effectuer le test sur votre machine ici.
var a = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
var log = (lettre, tableau) => console.log (lettre, tableau.join `,`);
fonction A (tableau) {
var index = array.indexOf (5);
supprimer le tableau [index];
log ('A', tableau);
}
fonction B (tableau) {
var index = array.indexOf (5);
var arr = Array.from (tableau);
arr.splice (index, 1)
log ('B', arr);
}
fonction C (tableau) {
var index = array.indexOf (5);
array.splice (index, 1);
log ('C', tableau);
}
fonction D (tableau) {
var arr = array.filter (élément => élément! == 5)
log ('D', arr);
}
fonction E (tableau) {
var index = array.indexOf (5);
var arr = array.filter ((élément, i) => i! == index)
log ('E', arr);
}
fonction F (tableau) {
var index = array.indexOf (5);
var arr = array.slice (0, index) .concat (array.slice (index + 1))
log ('F', arr);
}
fonction G (tableau) {
var index = array.indexOf (5);
var arr = [... array.slice (0, index), ... array.slice (index + 1)]
log ('G', arr);
}
fonction H (tableau) {
var index = array.indexOf (5);
var arr = tableau.slice (0);
arr.splice (index, 1);
log ('H', arr);
}
A ([... a]);
B ([... a]);
Californie]);
D ([... a]);
E ([... a]);
FA]);
Géorgie]);
Ha]);
Cet extrait de code ne présente que le code utilisé dans les tests de performances - il n'effectue pas de tests lui-même.
Comparaison pour les navigateurs: Chrome v78.0.0, Safari v13.0.4 et Firefox v71.0.0
|
Je suis assez nouveau dans JavaScript et j'avais besoin de cette fonctionnalité. J'ai simplement écrit ceci:
function removeFromArray (tableau, élément, index) {
while ((index = array.indexOf (item))> -1) {
array.splice (index, 1);
}
}
Puis quand je veux l'utiliser:
// Configurer des données factices
var dummyObj = {nom: "meow"};
var dummyArray = [dummyObj, "élément1", "élément1", "élément2"];
// Supprime les données factices
removeFromArray (dummyArray, dummyObj);
removeFromArray (dummyArray, "élément2");
Sortie - Comme prévu.
["élément1", "élément1"]
Vous pouvez avoir des besoins différents de moi, vous pouvez donc le modifier facilementpour leur convenir. J'espère que ça aidera quelqu'un.
|
Si vous avez des objets complexes dans le tableau, vous pouvez utiliser des filtres?
Dans les situations où $ .inArray ou array.splice n'est pas aussi facile à utiliser. Surtout si les objets sont peut-être peu profonds dans le tableau.
Par exemple. si vous avez un objet avec un champ Id et que vous souhaitez que l'objet soit supprimé d'un tableau:
this.array = this.array.filter (fonction (élément, i) {
return element.id! == idToRemove;
});
|
Je veux répondre basé sur ECMAScript 6. Supposons que vous avez un tableau comme ci-dessous:
soit arr = [1,2,3,4];
Si vous souhaitez supprimer à un index spécial comme 2, écrivez le code ci-dessous:
arr.splice (2, 1); // => arr est devenu [1,2,4]
Mais si vous souhaitez supprimer un élément spécial comme 3 et que vous ne connaissez pas son index, procédez comme ci-dessous:
arr = arr.filtre (e => e! == 3); // => arr est devenu [1,2,4]
Astuce: veuillez utiliser une fonction de flèche pour le rappel de filtre à moins que vous n'obteniez un tableau vide.
|
Mise à jour: cette méthode est recommandée uniquement si vous ne pouvez pas utiliser ECMAScript 2015 (anciennement ES6). Si vous pouvez l'utiliser, d'autres réponses ici fournissent des implémentations beaucoup plus soignées.
Cet élément essentiel résoudra votre problème et supprimera également toutes les occurrences de l'argument au lieu de seulement 1 (ou une valeur spécifiée).
Array.prototype.destroy = fonction (obj) {
// Renvoie null si aucun objet n'a été trouvé et supprimé
var détruit = nul;
pour (var i = 0; i  3
x.destroy (faux); // => faux
X; // => [1, 2, vrai, indéfini]
x.destroy (vrai); // => vrai
x.destroy (non défini); // => indéfini
X; // => [1, 2]
x.destroy (3); // => null
X; // => [1, 2]
|
Mise à jour ES10
Cet article résume les approches courantes de la suppression des éléments du tableau à partir d'ECMAScript 2019 (ES10).
1. Cas généraux
1.1. Suppression d'un élément Array par valeur à l'aide de .splice ()
| En place: Oui |
| Supprime les doublons: Oui (boucle), Non (indexOf) |
| Par valeur / index: Par index |
Si vous connaissez la valeur que vous souhaitez supprimer d'un tableau, vous pouvez utiliser la méthode splice. Vous devez d'abord identifier l'index de l'élément cible. Vous utilisez ensuite l'index comme élément de départ et supprimez un seul élément.
// Avec une boucle 'for'
const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];
pour (soit i = 0; i  [1, 2, 3, 4, 6, 7, 8, 9, 0]
// Avec la méthode .indexOf ()
const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];
const i = arr.indexOf (5);
arr.splice (i, 1); // => [1, 2, 3, 4, 6, 7, 8, 9, 0]
1.2. Suppression d'un élément Array à l'aide de la méthode .filter ()
| En place: Non |
| Supprime les doublons: Oui |
| Par valeur / index: Par valeur |
L'élément spécifique peut être filtré du tableau, en fournissant une fonction de filtrage. Une telle fonction est ensuite appelée pour chaque élément du tableau.
valeur const = 3
soit arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter (item => item! == valeur)
console.log (arr)
// [1, 2, 4, 5]
1.3. Suppression d'un élément Array en étendant Array.prototype
| En place: Oui / Non (dépend de la mise en œuvre) |
| Supprime les doublons: Oui / Non (dépend de la mise en œuvre) |
| Par valeur / index: Par index / Par valeur (dépend de l'implémentation) |
Le prototype d'Array peut être étendu avec des méthodes supplémentaires. Ces méthodes seront alors disponibles pour être utilisées sur les tableaux créés.
Remarque: l'extension de prototypes d'objets à partir d'une bibliothèque standard de JavaScript (comme Array) est considérée par certains comme un anti-modèle.
// En place, supprime tout, par mise en œuvre de la valeur
Array.prototype.remove = fonction (élément) {
pour (soit i = 0; i  = ES10)
| En place: Non |
| Supprime les doublons: Oui |
| Par valeur / index: Par valeur |
ES10 a introduit Object.fromEntries, qui peut êtreutilisé pour créer le tableau souhaité à partir de n'importe quel objet de type Array et filtrer les éléments indésirables pendant le processus.
objet const = [1,2,3,4];
const valueToRemove = 3;
const arr = Object.values ​​(Object.fromEntries (
Object.entries (objet)
.filter (([clé, val]) => val! == valueToRemove)
));
console.log (arr); // [1,2,4]
2. Cas particuliers
2.1 Suppression d'un élément s'il se trouve à la fin du tableau
2.1.1. Modification de la longueur du tableau
| En place: Oui |
| Supprime les doublons: Non |
| Par valeur / indice: N / A |
Les éléments JavaScript Array peuvent être supprimés de la fin d'un tableau en définissant la propriété length sur une valeur inférieure à la valeur actuelle. Tout élément dont l'index est supérieur ou égal à la nouvelle longueur sera supprimé.
const arr = [1, 2, 3, 4, 5, 6];
arr.length = 5; // Définit la longueur pour supprimer l'élément
console.log (arr); // [1, 2, 3, 4, 5]
2.1.2. Utilisation de la méthode .pop ()
| En place: Oui |
| Supprime les doublons: Non |
| Par valeur / indice: N / A |
La méthode pop supprime le dernier élément du tableau, renvoie cet élément et met à jour la propriété length. La méthode pop modifie le tableau sur lequel elle est appelée, cela signifie que contrairement à l'utilisation de delete, le dernier élément est complètement supprimé et la longueur du tableau réduite.
const arr = [1, 2, 3, 4, 5, 6];
arr.pop (); // renvoie 6
console.log (arr); // [1, 2, 3, 4, 5]
2.2. Suppression d'un élément s'il se trouve au début du tableau
| En place: Oui |
| Supprime les doublons: Non |
| Par valeur / indice: N / A |
La méthode .shift () fonctionne comme la méthode pop sauf qu'elle supprime le premier élément d'un tableau JavaScript au lieu du dernier. Lorsque l'élément est supprimé, les éléments restants sont décalés vers le bas.
const arr = [1, 2, 3, 4];
arr.shift (); // renvoie 1
console.log (arr); // [2, 3, 4]
2.3. Suppression d'un élément s'il s'agit du seul élément du tableau
| En place: Oui |
| Supprime les doublons: N / A |
| Par valeur / indice: N / A |
La technique la plus rapide consiste à définir une variable de tableau sur un tableau vide.
soit arr = [1];
arr = []; // tableau vide
Alternativement, la technique de 2.1.1 peut être utilisée en mettant la longueur à 0.
|
Vous ne devez jamais muter votre tableau. Cela va à l'encontre du modèle de programmation fonctionnelle. Vous pouvez créer un nouveau tableau sans référencer le tableau dont vous souhaitez modifier les données à l'aide du filtre de méthode ECMAScript 6;
var myArray = [1, 2, 3, 4, 5, 6];
Supposons que vous souhaitiez supprimer 5 du tableau, vous pouvez simplement le faire comme ceci:
myArray = myArray.filter (valeur => valeur! == 5);
Cela vous donnera un nouveau tableau sans la valeur que vous vouliez supprimer. Le résultat sera donc:
[1, 2, 3, 4, 6]; // 5 a été supprimé de ce tableau
Pour une meilleure compréhension, vous pouvez lire la documentation MDN sur Array.filter.
|
Une approche ECMAScript 2015 plus moderne (anciennement appelée Harmony ou ES 6). Donné:
éléments const = [1, 2, 3, 4];
indice const = 2;
Ensuite:
items.filter ((x, i) => i! == index);
Rendement:
[1, 2, 4]
Vous pouvez utiliser Babel et un service polyfill pour vous assurer que cela est bien pris en charge dans tous les navigateurs.
|
Vous pouvez faire une boucle arrière pour vous assurer de ne pas bousiller les index, s'il y a plusieurs instances de l'élément.
var myElement = "chocolat";
var myArray = ['chocolat', 'poptart', 'poptart', 'poptart', 'chocolat', 'poptart', 'poptart', 'chocolat'];
/ * Code important * /
pour (var i = myArray.length - 1; i> = 0; i--) {
if (myArray [i] == myElement) myArray.splice (i, 1);
}
console.log (myArray);
Démo en direct
|
Vous avez 1 à 9 dans le tableau et vous voulez supprimer 5. Utilisez le code ci-dessous:
var numberArray = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var newNumberArray = numberArray.filter (m => {
retourne m! == 5;
});
console.log ("nouveau tableau, 5 supprimés", newNumberArray);
Si vous souhaitez plusieurs valeurs. Exemple: - 1,7,8
var numberArray = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var newNumberArray = numberArray.filter (m => {
return (m! == 1) && (m! == 7) && (m! == 8);
});
console.log ("nouveau tableau, 1,7 et 8 supprimés", newNumberArray);
Si vous souhaitez supprimer une valeur de tableau dans un tableau. Exemple: [3,4,5]
var numberArray = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var removebleArray = [3,4,5];
var newNumberArray = numberArray.filter (m => {
return! removebleArray.includes (m);
});
console.log ("nouveau tableau, [3,4,5] supprimé", newNumberArray);
Comprend un navigateur pris en charge est un lien.
|
1
2
3
4
Prochain
Question très active. Gagnez 10 points de réputation pour répondre à cette question. L'exigence de réputation permet de protéger cette question contre les spams et les activités sans réponse.
Ce n'est pas la réponse que vous recherchez? Parcourez les autres questions marquées des tableaux javascript ou posez votre propre question.